<!doctype html>
<html lang="en">
    <head>
         <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>ArchiteXture</title>
        <link rel="stylesheet" href="../css/styles.css" type="text/css" media="screen" />
        <link rel="stylesheet" type="text/css" href="../css/print.css" media="print" />
        <!--[if IE]><script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
        <style type="text/css">
            .logout{
                loat: right;
                text-align: right;
                padding-right: 50px;
            }
        </style>
    </head>
    <body>
        <div id="wrapper"><!-- #wrapper -->

            <nav><!-- top nav -->
                <div class="menu">
                    <ul>
                        <li><a href="#">首页</a></li>
                        <li><a href="../Person/personIndex.do">个人工作</a></li>
                        <li><a href="#">需求系统</a></li>
                        <li><a href="#">研发分析</a></li>
                        <li><a href="#">资源管理</a></li>
                        <li><a href="#">项目进度</a></li>
                    </ul>
                </div>
                <div class="logout">登出</div>
            </nav><!-- end of top nav -->

            <header><!-- header -->
                <div id="plandesign"><img src="../images/plans.png" alt="" /></div>
                <h1><a href="#">ArchiteXture</a></h1>
                <p>Praesent libero. Sed cursus ante dapibus diam. Sed nisi. Nulla quis sem at nibh elementum imperdiet. Duis sagittis ipsum. Curabitur sodales ligula in libero. Sed dignissim lacinia nunc.</p>
            </header><!-- end of header -->

            <section id="main"><!-- #main content and sidebar area -->
                <section id="content"><!-- #content -->

                    <article>
                        <h2><a href="#">First Article Title</a></h2>
                        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec odio. Praesent libero. Sed cursus ante dapibus diam. Sed nisi. Nulla quis sem at nibh elementum imperdiet. Duis sagittis ipsum. Praesent mauris. Fusce nec tellus sed augue semper porta. Mauris massa. Vestibulum lacinia arcu eget nulla. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Curabitur sodales ligula in libero. Sed dignissim lacinia nunc. Fusce nec tellus sed augue semper porta. Mauris massa. Vestibulum lacinia arcu eget nulla.</p>
                    </article>

                    <article>
                        <h2><a href="#">Second Article Title</a></h2>
                        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec odio. Praesent libero. Sed cursus ante dapibus diam. Sed nisi. Nulla quis sem at nibh elementum imperdiet. Duis sagittis ipsum. Praesent mauris. Fusce nec tellus sed augue semper porta. Mauris massa. Vestibulum lacinia arcu eget nulla. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Curabitur sodales ligula in libero. Sed dignissim lacinia nunc.</p>
                        <p>Nulla quis sem at nibh elementum imperdiet. Duis sagittis ipsum. Praesent mauris. Fusce nec tellus sed augue semper porta. Mauris massa. Vestibulum lacinia arcu eget nulla. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.</p>
                        <p>Mauris massa. Vestibulum lacinia arcu eget nulla. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.</p>
                    </article>

                </section><!-- end of #content -->

                <aside id="sidebar"><!-- sidebar -->
                    <h3>Things To Do</h3>
                    <ul>
                        <li><a href="#">Play Games and Network</a></li>
                        <li><a href="#">Chat With Friends</a></li>
                        <li><a href="#">Swap Exciting Stories</a></li>
                        <li><a href="#">Sell Tons of Your Stuff</a></li>
                        <li><a href="#">Buy Stuff You Don't Need</a></li>
                        <li><a href="#">Trade Stuff With Others</a></li>
                    </ul>

                    <h3>Sponsors</h3>
                    <img src="../images/ad125.jpg" alt="" /> <img src="../images/ad125.jpg" alt="" /><br /><img src="../images/ad125.jpg" alt="" /> <img src="../images/ad125.jpg" alt="" /><br /><br />

                    <h3>Connect With Us</h3>
                    <ul>
                        <li><a href="#">Twitter</a></li>
                        <li><a href="#">Facebook</a></li>
                    </ul>

                </aside><!-- end of sidebar -->

            </section><!-- end of #main content and sidebar-->

            <footer>
                <section id="footer-area">

                    <section id="footer-outer-block">
                        <aside class="footer-segment">
                            <h4>Friends</h4>
                            <ul>
                                <li><a href="#">one linkylink</a></li>
                                <li><a href="#">two linkylinks</a></li>
                                <li><a href="#">three linkylinks</a></li>
                            </ul>
                        </aside><!-- end of #first footer segment -->

                        <aside class="footer-segment">
                            <h4>Awesome Stuff</h4>
                            <ul>
                                <li><a href="#">one linkylink</a></li>
                                <li><a href="#">two linkylinks</a></li>
                                <li><a href="#">three linkylinks</a></li>
                            </ul>
                        </aside><!-- end of #second footer segment -->

                        <aside class="footer-segment">
                            <h4>Coolness</h4>
                            <ul>
                                <li><a href="#">one linkylink</a></li>
                                <li><a href="#">two linkylinks</a></li>
                                <li><a href="#">three linkylinks</a></li>
                            </ul>
                        </aside><!-- end of #third footer segment -->

                        <aside class="footer-segment">
                            <h4>Blahdyblah</h4>
                            <p>Integer nec odio. Praesent libero. Sed cursus ante dapibus diam.</p>
                        </aside><!-- end of #fourth footer segment -->

                    </section><!-- end of footer-outer-block -->

                </section><!-- end of footer-area -->
            </footer>

        </div><!-- #wrapper -->
        <!-- Free template created by http://freehtml5templates.com -->
    </body>
</html>
